<template>
	<u-navbar
		:title="title"
		:titleStyle="{
			color,
		}"
		:bgColor="bgColor"
		:fixed="true"
		:border="false"
		:leftIcon="leftIcon"
		:leftIconColor="color"
		:rightIconColor="color"
		:style="{
			color,
		}"
		:titleWidth="300"
		:autoBack="autoBack"
		class="useNav"
		:safeAreaInsetTop="true"
		:placeholder="true"
		:isLeft="isLeft"
		@leftClick="back"
	>
		<template slot="right"><slot name="right"></slot></template>
	</u-navbar>
</template>

<script>
// import props from './props.js';

import { setThemeColor } from "@/utils/setTheme.js";
export default {
	name: "useNavBar",
	// mixins: [ props],
	props: {
		title: {
			type: String,
			default: "",
		},
		color: {
			type: String,
			default: "#fff",
		},
		rightIconColor: {
			type: String,
			default: "#fff",
		},
		autoBack: {
			type: Boolean,
			default: true,
		},
		bgColor: {
			type: String,
			default: setThemeColor(),
		},
		isLeft: {
			type: Boolean,
			default: true,
		},
		// 左边的图标
		leftIcon: {
			type: [String, Boolean],
			default: "arrow-left",
		},
	},
	data() {
		return {
			setThemeColor: setThemeColor(),
		};
	},
	mounted() {
		console.log("isLeft", this.isLeft);
	},
	methods: {
		// 点击左侧区域
		back() {
			console.log("isLeft", this.isLeft);
			if (this.isLeft) {
			}
			//this.$emit("clickLeft");
		},
	},
};
</script>

<style lang="scss"></style>
